<!doctype html>
<html lang="ch">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>辐射76加点模拟器</title>
        <meta name="description" content="辐射76在线加点模拟器..点击下面的Special字样切换相应种类的卡片.
         点击卡片来添加/删除卡片, 点击星星来选择卡片等级.如果需要重新加点可以使用网页最下方的'重新加点'按钮.
         如果你喜欢辐射76, 那就加入我们的QQ群吧: 953980582 (辐射76 交易所)">

        <link rel="stylesheet" href="css/bootstrap.min.css">
        <script src="js/jquery.min.js"></script>
        <script src="js/popper.min.js"></script>
        <script src="js/bootstrap.min.js"></script>
        
        <link rel="stylesheet" href="css/main.css?v=1.6">
        <script src="js/main.js?v=1.11"></script>
        <script src="js/PerkCardData.js"></script>
        <style>
    input::-webkit-outer-spin-button,
    input::-webkit-inner-spin-button {
        -webkit-appearance: none;
    }
    input[type="number"]{
        -moz-appearance: textfield;
    }
</style>
    </head>
    
    <body>
        <div class="container">

            <div class="text-center bg-warning p-5 rounded mt-2" id="browser">
                <h4>看起来你用的浏览器有点老了呢, 如果这个页面显示不正常, 请尝试下载最新的浏览器.</h4>
                <span>由于IE没有ES6支持, 所以IE等浏览器无法正常显示这个页面</span>
            </div>

            <script src="js/browserCheck.js?v=1.01"></script>

            <div class="jumbotron mt-2 text-white" style="background-color: #5b8f92 !important">
                <h1 class="font-weight-bold text-center">辐射76加点模拟器</h1>
                <div id="carouselControls" class="carousel slide" data-ride="carousel" data-interval="10000">
                    <div class="carousel-inner">
                        <div class="carousel-item active text-center">
                            点击下面的Special字样选择相应种类的卡片
                        </div>
                        <div class="carousel-item text-center">
                            点击卡片来添加/删除卡片, 点击星星来选择卡片等级
                        </div>
                        <div class="carousel-item text-center">
                            在辐射76中, 超过50级后不能再增加属性, 但是依旧可以获得卡片, 并且已经获得的卡片可以随时调换
                        </div>
                        <div class="carousel-item text-center">
                            你可以通过复制地址栏内的网页地址来分享你的加点
                        </div>
                        <div class="carousel-item text-center">
                            如果你喜欢辐射76, 那就加入我们的QQ群吧: 953980582 (辐射76 交易所)
                        </div>
                        <div class="carousel-item text-center">
                            如果需要重新加点可以使用网页最下方的"重新加点"按钮
                        </div>
                        <div class="carousel-item text-center">
                          在下方输入框输入武器数值可自动计算出当前套牌的基础攻击力和最大攻击力
                        </div>
                    </div>
                    <a class="carousel-control-prev" href="#carouselControls" role="button" data-slide="prev">
                        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                        <span class="sr-only">Previous</span>
                    </a>
                    <a class="carousel-control-next" href="#carouselControls" role="button" data-slide="next">
                        <span class="carousel-control-next-icon" aria-hidden="true"></span>
                        <span class="sr-only">Next</span>
                    </a>
                </div>
                <div align="center">
              	  <br>
                	<input class="form-control" id="weaponDamageVal" type="number"  placeholder="武器基础伤害值" min="1" style="width: 140px;" onkeyup="calculation();" oninput = "value=value.replace(/[^\d]/g,'')" /><br>
       				<span>累计加成: </span><span style="font-size: 30px;color: red;" id="multiple">0</span><br>
                	<span>预计伤害: </span><span style="font-size: 30px;" id="estimatedValue">0</span>
                </div>
            </div>



            <div class="d-inline justify-content-around d-md-flex" id="specials">
                
                <div class="stats-card bg-s" id="strength" onclick="showCards(SpecialEnum.STRENGTH)">
                    <h2>力量</h2>
                    <h1>S</h1>
                    <p><span class="special-amount" id="s-amount">1</span>点</p>
                </div>
                <div class="stats-card bg-p" id="perception" onclick="showCards(SpecialEnum.PERCEPTION)">
                    <h1>P</h1>
                    <h2>感知</h2>
                    <p><span class="special-amount" id="p-amount">1</span>点</p>
                </div>
                <div class="stats-card bg-e" id="endurance" onclick="showCards(SpecialEnum.ENDURANCE)">
                    <h1>E</h1>
                    <h2>耐力</h2>
                    <p><span class="special-amount" id="e-amount">1</span>点</p>
                </div>
                <div class="stats-card bg-c" id="charisma" onclick="showCards(SpecialEnum.CHARISMA)">
                    <h1>C</h1>
                    <h2>魅力</h2>
                    <p><span class="special-amount" id="c-amount">1</span>点</p>
                </div>
                <div class="stats-card bg-i" id="intelligence" onclick="showCards(SpecialEnum.INTELLIGENCE)">
                    <h1>I</h1>
                    <h2>智力</h2>
                    <p><span class="special-amount" id="i-amount">1</span>点</p>
                </div>
                <div class="stats-card bg-a" id="agility" onclick="showCards(SpecialEnum.AGILITY)">
                    <h1>A</h1>
                    <h2>敏捷</h2>
                    <p><span class="special-amount" id="a-amount">1</span>点</p>
                </div>
                <div class="stats-card bg-l" id="luck" onclick="showCards(SpecialEnum.LUCK)">
                    <h1>L</h1>
                    <h2>幸运</h2>
                    <p><span class="special-amount" id="l-amount">1</span>点</p>
                </div>
            </div>
            
            <div id="points-display" style="margin-right: 2rem;">
                <span style="font-weight: 700; color: darkgray;">剩余点数: <span id="points">49</span></span>
            </div>
            
            <div class="d-md-flex justify-content-around" id="decks">
                <div class="deck" id="s-deck">   
                    
                </div>
                <div class="deck" id="p-deck">
                    
                </div>
                <div class="deck" id="e-deck">
                    
                </div>
                <div class="deck" id="c-deck">
                    
                </div>
                <div class="deck" id="i-deck">
                    
                </div>
                <div class="deck" id="a-deck">
                    
                </div>
                <div class="deck" id="l-deck">
                    
                </div>
            </div>
            
            <div id="card-selections">

            </div>
            <div class="d-flex justify-content-center my-2">
                <a class="mx-2 btn btn-primary" href="https://github.com/FanghanHu/Fallout76CardBuilder/issues">反馈</a>
                <a class="mx-2 btn btn-info" href="index.html">重新加点</a>
                <button class="mx-2 btn btn-success" onclick="copyLink()">分享</button>
            </div>
            <span class="d-block text-center mt-5">未经许可, 请勿转载</span>
            <span class="d-block text-center mb-3">Copyright 2018, Fanghan Hu</span>
            <!--suppress HtmlFormInputWithoutLabel -->
            <input type="text" value=":)" id="url-selector">
        </div>
    </body>
</html>